<template>

  <div class="common-layout">
    <el-container>
      <el-header>
        <el-menu
            :default-active="activeIndex"
            class="el-menu-demo"
            mode="horizontal"
            @select="handleSelect"
            :router="true"
        >
          <el-menu-item index="1" route="/student/stuMain">首页</el-menu-item>
          <el-menu-item index="2"  route="/student/stuCourse" >课程</el-menu-item>
          <el-menu-item index="3" route="/student/stuCenter">笔记编写</el-menu-item>
          <el-menu-item index="4" route="/student/stuArticle">笔记浏览</el-menu-item>
          <el-menu-item index="5" route="/student/Article"></el-menu-item>
          <el-menu-item index="6" route="/student/ansQuestion">答疑</el-menu-item>
          <el-dropdown style="margin-top: 20px;margin-left:500px;">
			    <span class="el-dropdown-link">
			      欢迎登录
			      <el-icon class="el-icon--right">
              <arrow-down />
			      </el-icon>
			    </span>
            <template #dropdown>
              <el-dropdown-menu>
                <el-dropdown-item @click.native="logout">退出登录</el-dropdown-item>
              </el-dropdown-menu>
            </template>
          </el-dropdown>
        </el-menu>

      </el-header>
      <el-main><router-view></router-view></el-main>
    </el-container>
  </div>

</template>

<script>
import { ref } from 'vue'
import {useLoginStateStore} from "../store/storeLoginState.js";


export default {
  name: "Student",

  data() {
    return {
      activeIndex:"1",
      classNum:'',
    }
  },
  //判断学生是否加入班级
  mounted() {




        },
  methods:{

    handleSelect(selectedIndex){
      this.activeIndex=selectedIndex;
    },
    logout() {
      this.$confirm('您确定要退出登录吗?', '提示', {
        confirmButtonText: 'sure',  //确认按钮的文字显示
        type: 'warning',
        center: true, //文字居中显示
      })
          .then(() => {
            this.$message({
              type: 'success',
              message: '退出登录成功'
            })
            this.$router.push("/")
            sessionStorage.clear()
          })
          .catch(() => {
            this.$message({
              type: 'info',
              message: '已取消退出登录'
            })
          })

    },
  }
}
</script>

<style scoped>

</style>
